<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>咸阳恒源汽贸有限公司工资发放管理小程序平台</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        .background-style {
            background: url('./dist/img/bg4.jpg');
            background-size: 100%;
        }
        .div-center {
            height: 60px;
            right: 0;
            left: 0;
            position: absolute;
            margin: auto;
        }
     /*   .card {
            background: none;
            color: #ffffff;
        }*/
    </style>
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <nav class="wrapper navbar navbar-expand  navbar-light ">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <!--<li class="nav-item">-->
            <!--<a class="nav-link" data-widget="pushmenu" href="#"><i class="fa fa-bars"></i></a>-->
            <!--</li>-->
            <li class="nav-item d-none d-sm-inline-block" style="padding-left: 2rem;">
                <a  href="#" onclick="menuAction(this,'./web/main_home.html',true)" class="nav-link text-light " style="font-size: 1.6rem;">咸阳恒源汽贸有限公司工资发放管理小程序平台</a>
            </li>


            <li class="nav-item d-none d-sm-inline-block  mt-2" style="margin-left: 8rem;">
                <a href="#" onclick="menuAction(this,'./web/main2_part1.html')" class="nav-link text-light " style="font-size: 1.3rem;">创业青年</a>
            </li>

            <li class="nav-item d-none d-sm-inline-block mt-2 ml-4">
                <a href="#" onclick="menuAction(this,'./web/main2_part2.html')" class="nav-link text-light " style="font-size: 1.3rem;">创业导师</a>
            </li>
            <li class="nav-item d-none d-sm-inline-block mt-2 ml-4">
                <a href="#" onclick="menuAction(this,'./web/main2_part3.html')" class="nav-link text-light " style="font-size: 1.3rem;">创业园区</a>
            </li>

            <li class="nav-item d-none d-sm-inline-block mt-2 ml-4">
                <a href="#" onclick="menuAction(this,'./web/main2_part4.html')" class="nav-link text-light " style="font-size: 1.3rem;">服务机构</a>
            </li>
        </ul>
        <!-- SEARCH FORM -->
        <!--<form class="form-inline ml-3">-->
        <!--<div class="input-group input-group-sm">-->
        <!--<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">-->
        <!--<div class="input-group-append">-->
        <!--<button class="btn btn-navbar" type="submit">-->
        <!--<i class="fa fa-search"></i>-->
        <!--</button>-->
        <!--</div>-->
        <!--</div>-->
        <!--</form>-->
        <!-- Right navbar links -->
    </nav>
    <!-- Content Header (Page header) -->
    <div class="content-header" style="padding: 20px;padding-bottom: 0px;">
        <div class="container-fluid" style="margin-top: 20px;">
            <div class="row mb-2">
                <div class="col-sm-2">

                </div><!-- /.col -->
                <div class="col-sm-8">
                        <span class="w-50 float-left text-center  text-light text-bold">
                           科技交易增长量
                        </span>
                    <span class="w-25 float-left text-center text-light text-bold">
                            科技成果增长量
                        </span>
                    <span class="w-50 float-left text-center  text-light "
                          style="font-size: 3rem;font-family: 'Adobe Fan Heiti Std B'">
                           001354
                        </span>
                    <span class="w-25 float-left text-center text-light"
                          style="font-size: 3rem;font-family: 'Adobe Fan Heiti Std B'">
                           001871
                        </span>
                </div>
                <div class="col-sm-2">
                    <div class="breadcrumb float-sm-right w-100 ">
                        <li class="breadcrumb-item active text-light text-right"
                            style="font-size: 1.1rem;text-align: center" id="date"></li>
                    </div>
                    <div class="breadcrumb float-sm-right w-100 ">
                        <li class="breadcrumb-item active text-light text-right"
                            style="font-size: 2rem;text-align: center" id="date2"></li>
                    </div>

                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->
    <!-- Main content -->
    <section class="content" style="padding: 20px;padding-top: 5px;padding-bottom: 0">
        <div class="container-fluid">
            <!-- Small boxes (Stat box) -->

            <div class="row">

                <div class="col-md-2 connectedSortable" style="margin-top: 0px;">
                    <!-- Map card -->
                    <div class="card-style " style="border: 1px solid #4199e7;;margin-top: 20px;">
                        <div class="card-header">
                            <h3 class="card-title">用户增长趋势</h3>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <div class="row margin">
                                <div class="col-sm-4">
                                    <p>创业者&nbsp;</p>
                                    <p>创业导师</p>
                                    <p>创业园区</p>
                                    <p>创业项目</p>
                                </div>
                                <div class="col-sm-8">

                                    <div class="slider slider-horizontal" id="blue">
                                        <div class="slider-track">
                                            <div class="slider-selection" style="left: 0%; width: 85%;">

                                            </div>
                                        </div>

                                    </div>

                                    <div class="slider slider-horizontal" id="red">
                                        <div class="slider-track">
                                            <div class="slider-selection" style="left: 0%; width: 45%;">

                                            </div>
                                        </div>

                                    </div>

                                    <div class="slider slider-horizontal" id="yellow">
                                        <div class="slider-track">
                                            <div class="slider-selection" style="left: 0%; width: 55%;">

                                            </div>
                                        </div>

                                    </div>

                                    <div class="slider slider-horizontal" id="green">
                                        <div class="slider-track">
                                            <div class="slider-selection" style="left: 0%; width: 90%;">

                                            </div>
                                        </div>

                                    </div>



                                </div>

                            </div>
                        </div>

                    </div>
                    <div class="card-style " style="border: 1px solid #4199e7;margin-top: 30px;">
                        <div class="card-header">
                            <h3 class="card-title">园区入驻增长趋势</h3>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-12">
                                    <div id="data1" style="width: 100%;height: 150px;border: 0px solid #000;"></div>
                                </div>
                                <!-- /.col -->
                                <div class="col-md-4">

                                </div>
                                <!-- /.col -->
                            </div>
                            <!-- /.row -->
                        </div>
                    </div>
                    <!-- /.card -->
                </div>
                <!-- /.mt-4 progress-group -->
                <section class="col-md-7 connectedSortable">
                    <!-- Map card -->
                    <div class="card bg-primary-gradient" style="background: none;box-shadow: none;">
                        <div id="mainmap"
                             style=" height: 600px; user-select: none; position: relative;background: none"
                             _echarts_instance_="ec_1529047116337">
                        </div>
                    </div>
                    <!-- /.card -->
                </section>
                <div class="col-md-3 connectedSortable" style="margin-top: 0px;">
                    <!-- Map card -->
                    <div class="card-style " style="border: 1px solid #4199e7;margin-top: 20px;">
                        <div class="card-header">
                            <h3 class="card-title">企业类型分布</h3>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-8">
                                    <div class="chart-responsive">
                                        <canvas id="pieChart" height="142" width="254"
                                                style="width: 254px; height: 142px;"></canvas>
                                    </div>
                                    <!-- ./chart-responsive -->
                                </div>
                                <!-- /.col -->
                                <div class="col-md-4">
                                    <ul class="chart-legend clearfix">
                                        <li><i class="fa fa-circle-o text-danger mt-4"></i>&nbsp;&nbsp;双创企业</li>
                                        <li><i class="fa fa-circle-o text-success mt-4"></i>&nbsp;&nbsp;中小企业</li>
                                        <li><i class="fa fa-circle-o text-warning mt-4"></i>&nbsp;&nbsp;高新企业</li>
                                    </ul>
                                </div>
                                <!-- /.col -->
                            </div>
                            <!-- /.row -->
                        </div>

                    </div>
                    <div class="card-style " style="border: 1px solid #4199e7;margin-top: 30px;">
                        <div class="card-header">
                            <h3 class="card-title">用户数量统计</h3>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body">

                            <div class="row">
                                <div class="col-md-4 " style="height: 60px;">
                                    <span class="info-box-icon bg-warning elevation-1 div-center div-center"  style="height: 60px;"><i class="fa fa-users"></i></span>
                                </div>
                                <!-- /.col -->
                                <div class="col-md-4">
                                    <span class="info-box-icon bg-success elevation-1 div-center"  style="height: 60px;"><i class="fa fa-user  "></i></span>
                                </div>
                                <div class="col-md-4">
                                    <span class="info-box-icon bg-gray elevation-1 div-center"  style="height: 60px;"><i class="fa fa-building"></i></span>
                                </div>
                                <!-- /.col -->
                            </div>
                            <div class="row mt-2">
                                <div class="col-md-4 text-center">
                                    创业青年
                                </div>
                                <!-- /.col -->
                                <div class="col-md-4 text-center">
                                    创业导师
                                </div>
                                <div class="col-md-4 text-center">
                                    创业园区
                                </div>
                                <!-- /.col -->
                            </div>
                            <!-- /.row -->

                            <div class="row mt-2">
                                <div class="col-md-4 text-center">
                                    832人
                                </div>
                                <!-- /.col -->
                                <div class="col-md-4 text-center">
                                    962人
                                </div>
                                <div class="col-md-4 text-center">
                                    14家
                                </div>
                                <!-- /.col -->
                            </div>
                            <!-- /.row -->
                        </div>
                    </div>
                    <!-- /.card -->
                    <!--<div class="card-style ">-->
                    <!--<div class="card-header">-->
                    <!--<h3 class="card-title">数据统计3</h3>-->
                    <!--</div>-->
                    <!--&lt;!&ndash; /.card-header &ndash;&gt;-->
                    <!--<div class="card-body">-->
                    <!--<div class="row">-->
                    <!--<div class="col-md-8">-->
                    <!--<div class="chart-responsive">-->
                    <!--<canvas id="pieChart3" height="142" width="254"-->
                    <!--style="width: 254px; height: 142px;"></canvas>-->
                    <!--</div>-->
                    <!--&lt;!&ndash; ./chart-responsive &ndash;&gt;-->
                    <!--</div>-->
                    <!--&lt;!&ndash; /.col &ndash;&gt;-->
                    <!--<div class="col-md-4">-->
                    <!--<ul class="chart-legend clearfix">-->
                    <!--<li><i class="fa fa-circle-o text-danger"></i> Chrome</li>-->
                    <!--<li><i class="fa fa-circle-o text-success"></i> IE</li>-->
                    <!--<li><i class="fa fa-circle-o text-warning"></i> FireFox</li>-->
                    <!--<li><i class="fa fa-circle-o text-info"></i> Safari</li>-->
                    <!--&lt;!&ndash;<li><i class="fa fa-circle-o text-primary"></i> Opera</li>&ndash;&gt;-->
                    <!--&lt;!&ndash;<li><i class="fa fa-circle-o text-secondary"></i> Navigator</li>&ndash;&gt;-->
                    <!--</ul>-->
                    <!--</div>-->
                    <!--&lt;!&ndash; /.col &ndash;&gt;-->
                    <!--</div>-->
                    <!--&lt;!&ndash; /.row &ndash;&gt;-->
                    <!--</div>-->
                    <!--</div>-->
                </div>
            </div>


        </div><!-- /.container-fluid -->
    </section>
    <!-- /.content -->
    <div class="row">
        <footer class="main-footer text-center"
                style="width: 100%;margin-left: 0;border: none; background: none;color: #ffffff;font-size: 12px;">
            <span> 咸阳恒源汽贸有限公司 Copyright &copy; 2015-2018.</span>
        </footer>
    </div>
</div>


<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="./dist/js/pages/dashboard.js"></script>

<script>
    $(function () {
        /* BOOTSTRAP SLIDER */
        $('.slider').slider()

        /* ION SLIDER */
        $('#range_1').ionRangeSlider({
            min: 0,
            max: 5000,
            from: 1000,
            to: 4000,
            type: 'double',
            step: 1,
            prefix: '$',
            prettify: false,
            hasGrid: true
        })
        $('#range_2').ionRangeSlider()

        $('#range_5').ionRangeSlider({
            min: 0,
            max: 10,
            type: 'single',
            step: 0.1,
            postfix: ' mm',
            prettify: false,
            hasGrid: true
        })
        $('#range_6').ionRangeSlider({
            min: -50,
            max: 50,
            from: 0,
            type: 'single',
            step: 1,
            postfix: '°',
            prettify: false,
            hasGrid: true
        })

        $('#range_4').ionRangeSlider({
            type: 'single',
            step: 100,
            postfix: ' light years',
            from: 55000,
            hideMinMax: true,
            hideFromTo: false
        })
        $('#range_3').ionRangeSlider({
            type: 'double',
            postfix: ' miles',
            step: 10000,
            from: 25000000,
            to: 35000000,
            onChange: function (obj) {
                var t = ''
                for (var prop in obj) {
                    t += prop + ': ' + obj[prop] + '\r\n'
                }
                $('#result').html(t)
            },
            onLoad: function (obj) {
                //
            }
        })
    })
</script>
<script>
    function menuAction(obj, href,flag) {
        if (href.indexOf("admin.action") != -1) {
            $("#content-wrapper").addClass("background-style");
        } else {
            $("#content-wrapper").removeClass("background-style");
        }

        if(flag){
            $("#content-wrapper").addClass("background-style");
        }else{
            $("#content-wrapper").removeClass("background-style");
        }

        var tds = $("nav").children();
        var i;
        $.each(tds, function (i, val) {
            if($(val)!=$(obj))
            {
                $(val).find("li.has-treeview").removeClass("menu-open");
                $(val).find("ul.nav-treeview").css("display","none");
            }
            var tt = $(val).find("a");
            tt.removeClass("active");

        });

        var object = $(obj);
        object.addClass("active");
        $(obj).parent().parent().parent("li.has-treeview").addClass("menu-open");
        $(obj).parent().parent("ul.nav-treeview").css("display","block");
        $("#content-wrapper").load(href);

    }
</script>
</body>
<!-- AdminLTE for demo purposes -->
<script src="./dist/js/demo.js"></script>
<script type="text/javascript" src="./map/js/app.js"></script>
</html>
